<template>

  <div @click="toCard()">
    <van-row type="flex" justify="space-between" align="center">
      <van-col :span="18">
        <van-row type="flex" align="center">
          <van-col :span="5"><img src="@/assets/images/img_report.png" style="width:45px" alt=""></van-col>
          <van-col :span="18" class="L-margin-left-5">
            <div class="L-big-text L-bold-text">{{ item.weekreports_sname }}</div>
          </van-col>
        </van-row>
      </van-col>
      <van-col :span="6" style="text-align: right;">
        <van-tag v-if="item.read === 'true'" color="#ecf6ff" text-color="#3880ca" size="large" round>已读</van-tag>
        <van-tag v-else color="#fef0f0" text-color="#F56C6C" size="large" round>未读</van-tag>
      </van-col>
    </van-row>
    <van-divider />
    <van-row type="flex" justify="space-between" align="center" style="color:#606266">
      <van-col><span class="L-small-text">负责人 {{ item.weekreports_idowner_ref }}</span></van-col>
      <van-col>
        <span class="L-small-text">{{ item.value }}</span>
        <van-icon name="arrow" style="margin-left:10px" />

        <!-- <van-button @click="toCard()" round size="small" color="#1683f7" style="width:80px">查看详情</van-button> -->
      </van-col>
    </van-row>

  </div>

</template>

<script setup lang="ts">
import { onMounted, ref, defineProps } from "vue";
import { useRouter, useRoute } from "vue-router"
const router = useRouter()

import { useCheck } from "@/hooks/hooks.js";
const { checkCustomized } = useCheck();

const props = defineProps({

  item: {
    type: Object,
    default: {},
  },
  idobject: {
    type: [String, Array],
    default: "",
  },
  idtemplate: {
    type: [String, Array],
    default: "",
  },

});



function toCard() {

  const { item, idobject, idtemplate } = props;

  const path = checkCustomized(`/${props.idobject}Card`)
    ? `/${props.idobject}Card`
    : "defaultCard";
  router.push({
    path: path,
    query: {
      itemid: item[`${idobject}_id`],
      idobject,
      idtemplate,
    },
  });

}
</script>

<style scoped></style>